import React from 'react';
import { Input, Modal, Form, message } from 'antd';
import './index.less';
import copy from 'copy-to-clipboard';
import Tips from '../../Tips/index';
import { connect } from 'react-redux';

const FormItem = Form.Item;
class Invite extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      value: 1,
      disabled: '',
      invitation: '',
      update: 0
    };
  }
  copyUrl = url => {
    copy(url);
    message.success('复制成功，如果失败，请在输入框内手动复制.');
  }
  render() {
    var { visible, onCancel, data } = this.props;
    if (!data) data = [];
    return (
      <Modal
        className="detailclosekeymanagement"
        visible={visible}
        closable={false}
        title="邀请安装"
        okText="返回"
        onCancel={onCancel}
        onOk={onCancel}
      >
        <div className="invitationBox">
          <div>您需要邀请其他组织安装您创建的Chaincode来完成交易，请将下面的邀请码复制给其他组织的管理员来安装Chaincode。</div>
          <FormItem label="邀请码" labelCol={{ span: 5 }} wrapperCol={{ span: 16 }}>
            <div className="invitationCode">
              <em className="codetype">{data.chancodeId}</em>
              <span className="copyCode" onClick={this.copyUrl.bind(this, data.chancodeId)}>复制邀请码</span>
            </div>
          </FormItem>
          <FormItem label="网络" labelCol={{ span: 5 }} wrapperCol={{ span: 16 }}>
            <Input rows={4} disabled value={data.fabricflag} />
          </FormItem>
          <FormItem label="Name" labelCol={{ span: 5 }} wrapperCol={{ span: 16 }}>
            <Input rows={4} disabled value={data['名称']} />
          </FormItem>
          <FormItem label="Version" labelCol={{ span: 5 }} wrapperCol={{ span: 16 }}>
            <Input rows={4} disabled value={data['版本']} />
          </FormItem>
        </div>
        <Tips message={this.state.message} />
      </Modal>
    );
  }
}

export default connect(state => {
  return { ...state };
})(Invite);
